<!DOCTYPE html>
<html lang="zh-cn" >
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="author"
      content="awesome404"
    />
      
    <title>JavaScript由来 ｜ 鹊木笔记</title>
    
    
    
    <meta name="description" content="JavaScript历史 诞生 JavaScript 诞生于1995年，简称 JS，由网景公司 Netscape 开发，当时的网景公司正凭借其 Navigator 浏览器成为Web时代开启时最著名的第一代互联网公司，由于网景公司希望能在静态HTML页面上添加一些动" />
      
    <meta
      name="keywords"
      content="Blog, 程序员, 前端"
    />
      <link
    rel="shortcut icon" href="https://awesome404.gitee.io/images/favicon.ico" />

    <link
      rel="stylesheet"
      type="text/css"
      media="screen"
      href="https://awesome404.gitee.io/css/normalize.css"
    />
    <link
      rel="stylesheet"
      type="text/css"
      media="screen"
      href="https://cdn.jsdelivr.net/npm/animate.css@4.1.0/animate.min.css"
    />
    <link rel="stylesheet" type="text/css" media="screen" href="https://awesome404.gitee.io/css/zozo.css" />
    <link
      rel="stylesheet"
      type="text/css"
      media="screen"
      href="https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css"
    />
    <link rel="stylesheet" type="text/css" media="screen" href="https://awesome404.gitee.io/css/highlight.css" />

    
    
  </head>
</html>


<body>
    <div class="main animate__animated animate__fadeInDown">
        
<div class="nav_container animated fadeInDown">
  <div class="site_nav" id="site_nav">
    <ul>
      
      <li>
        <a href="/">首页</a>
      </li>
      
      <li>
        <a href="/posts/">归档</a>
      </li>
      
      <li>
        <a href="/tags/">标签</a>
      </li>
      
      <li>
        <a href="/about/">关于</a>
      </li>
      
    </ul>
  </div>
  <div class="menu_icon">
    <a id="menu_icon">
      <i class="ri-settings-line"></i>
    </a>
  </div>
</div>

        <div class="header animated fadeInDown">
  <div class="site_title_container">
    <div class="site_title">
      <h1>
        <a href="https://awesome404.gitee.io">
          <span>鹊木笔记</span>
        </a>
      </h1>
    </div>
    <div class="description">
      <p class="sub_title">
        前端菜鸡的自我修养
      </p>
      <div class="my_socials">
         
        <a href="https://github.com/404Awesome" title="github" target="_blank"
          ><i class="ri-github-fill"></i
        ></a>
         
        <a
          href="https://awesome404.gitee.io/index.xml"
          type="application/rss+xml"
          title="rss"
          target="_blank"
          ><i class="ri-rss-fill"></i
        ></a>
      </div>
    </div>
  </div>
</div>

        <div class="content">
            <div class="post_page">
                <div class="post animate__animated animate__fadeInDown">
                    <div class="post_title post_detail_title">
                        <h2><a href='/posts/javascript%E7%94%B1%E6%9D%A5/'>JavaScript由来</a></h2>
                        <span class="date">2020.03.26</span>
                    </div>
                    <div class="post_content markdown"><h1 id="javascript历史">JavaScript历史</h1>
<h2 id="诞生">诞生</h2>
<p>JavaScript 诞生于1995年，简称 JS，由网景公司 Netscape 开发，当时的网景公司正凭借其 Navigator 浏览器成为Web时代开启时最著名的第一代互联网公司，由于网景公司希望能在静态HTML页面上添加一些动态效果，据说由 Brendan Eich 在两周内就设计出了 JavaScript，JS是一种网页脚本语言，当时是为了能让网页拥有更好的交互体验而开发的</p>
<h2 id="更名">更名</h2>
<p>起初该编程语言并非叫做 JavaScript，而是叫做 LiveScript，后来因为 Sun 公司所开发的 Java 在当时的人气很高，加上自身在市场上的反馈不是很理想，然将 LiveScript 改名为 JavaScript，想要通过名称来混淆视野，以此提升自己的人气，但是 Java 和 JavaScript 终究是两回事，并没有太多关系</p>
<h2 id="标准化">标准化</h2>
<p>其实可以将 ECMAScript 简称 ES 理解为 JavaScript，本质上是差不多的，因为当时 JavaScript 的出现，改变了网页的格局，随着 JavaScript 的大火，一年后微软模仿 JavaScript 开发了 JScript，为了让 JavaScript 成为全球标准，因此由 几个公司联合 ECMA（European Computer Manufacturers Association 欧洲计算机制造商协会）组织共同定制了 JavaScript 语言的标准，被称为 ECMAScript 标准，因此才能够让 JavaScript 标准化，否则，你懂的，头发 -1，1997年06月 ECMA-262 的第一个版本于被欧洲计算机制造商协会采纳，并将 ECMA-262 标准取名为 ECMAScript，其中 ES3 被浏览器厂商所普及，也是最通行的一个版本，ES6 改动较大，同时也增加了许多新特性，学习完基础后，便可以尝试学习 ES6 语法了, ES7, ES8 等&hellip;</p>
<p class="alert alert-primary">可以学习阮一峰的 <a target="_blank" class="alert-link" href="https://es6.ruanyifeng.com/">ES6 入门教程</a></p>
<h3 id="es-版本情况">ES 版本情况</h3>
<ol>
<li>
<p>ES 1</p>
<blockquote>
<p>发布时间: 1997-06</p>
<p>描述:   ECMA 发布 262 号标准文件 (ECMA-262)，规定了浏览器脚本语言的标准</p>
</blockquote>
</li>
<li>
<p>ES 2</p>
<blockquote>
<p>发布时间: 1998-06</p>
<p>描述:   未增加新特性，对内容做了调整</p>
</blockquote>
</li>
<li>
<p>ES 3</p>
<blockquote>
<p>发布时间: 1999-12</p>
<p>描述:   有较好的完善修改，成为了通用标准，目前绝大多数浏览器都支持这个版本</p>
</blockquote>
</li>
<li>
<p>ES 4</p>
<blockquote>
<p>发布时间: 2008-07</p>
<p>描述:   因为提议的改动太大，未通过</p>
</blockquote>
</li>
<li>
<p>ES 5</p>
<blockquote>
<p>发布时间: 2009-12</p>
<p>描述:   新功能主要包括：JSON对象 (含parse/stringify等方法)，Array和Object增加一些方法，严格模式 (use strict)，函数的bind方法等</p>
</blockquote>
</li>
<li>
<p>ES 6</p>
<blockquote>
<p>发布时间: 2015-06</p>
<p>描述:   也称之为 ECMAScript 2015，该版本改动较大，同时也增加了许多特性，比如，let/const、变量的解构赋值、Promise 等</p>
</blockquote>
</li>
<li>
<p>ES 7</p>
<blockquote>
<p>发布时间: 2016</p>
<p>描述:   也称之为 ECMAScript 2016，Array.prototype.includes()，求幂运算符等</p>
</blockquote>
</li>
<li>
<p>ES 8</p>
<blockquote>
<p>发布时间: 2017</p>
<p>描述:   也称之为 ECMAScript 2017，异步函数，共享内存等</p>
</blockquote>
</li>
<li>
<p>ES 9</p>
<blockquote>
<p>发布时间: 2018</p>
<p>描述:     也称之为 ECMAScript 2018，异步迭代等</p>
</blockquote>
</li>
</ol>
<h3 id="es-语法提案">ES 语法提案</h3>
<ol>
<li>
<p>Stage 0</p>
<blockquote>
<p>定义：Strawman（展示阶段）</p>
<p>内容：任何尚未提交为正式提案的讨论，想法，改变或对已有规范的补充建议都被认为是一个稻草人草案（“strawman” proposal），但只有TC39成员可以提出此阶段的草案。</p>
</blockquote>
</li>
<li>
<p>Stage 1</p>
<blockquote>
<p>定义：Proposal（征求意见阶段）</p>
<p>内容：此阶段，稻草人草案升级为正式化的提案，并将逐步解决多部门关切的问题，如与其他提案的相互之间会有什么影响，这一草案具体该如何实施等问题。人们需要对这些问题提供具体的解决方案。stage1的提案通常还需要包括API描述，拥有说明性使用示例，并对语义和算法进行讨论，一般来说草案在这一阶段会经历巨大的变化。</p>
</blockquote>
</li>
<li>
<p>Stage 2</p>
<blockquote>
<p>定义：Draft（草案阶段）</p>
<p>内容：此阶段，草案就有了初始的规范。通过 polyfill，开发者可以开始使用这一阶段的草案了，一些浏览器引擎也会逐步对这一阶段的规范的提供原生支持，此外通过使用构建工具也可以编译源代码为现有引擎可以执行的代码，这些方法都使得这一阶段的草案可以开始被使用了。</p>
</blockquote>
</li>
<li>
<p>Stage 3</p>
<blockquote>
<p>定义：Candidate（候选人阶段）</p>
<p>内容：此阶段的规范就属于候选推荐规范了，这一阶段之后变化就不会那么大了，要达到这一阶段需要满足以下条件：</p>
<ul>
<li>规范的编辑和指定的审阅者必须在最终规范上签字；</li>
<li>用户也应该对该提议感兴趣；</li>
<li>提案必须至少被一个浏览器原生支持；</li>
<li>拥有高效的 ployfill，或者被Babel支持；</li>
</ul>
</blockquote>
</li>
<li>
<p>Stage 4</p>
<blockquote>
<p>定义：Finished（定案阶段）</p>
<p>内容：此阶段的提案必须有两个独立的通过验收测试的实现，进入第4阶段的提案将包含在 ECMAScript 的下一个修订版中。</p>
</blockquote>
</li>
</ol>
<p class="alert alert-primary"> ES 语法提案内容出之 segmentfault 社区的 zhangwang
<br>想要了解关于此内容更详细的信息请 <a target="_blank" href="https://segmentfault.com/a/1190000010074709" class="alert-link">点击此链接</a> 进行阅读</p>
<h3 id="实现">实现</h3>
<p>ECMAScript 是一个标准，而这个标准需要各个浏览器厂商去实现，不同浏览器厂商都会对该标准有着不同的实现方式，不同的浏览器有着不同的 JS 引擎，用来解析并执行 JS 代码，但是浏览器之间的引擎是不一样，所导致的实现效果也是有些区别，具体如下：</p>
<ol>
<li>
<p>Mozilla 公司</p>
<blockquote>
<p>浏览器：FireFox</p>
<p>JS 引擎：SpiderMonkey / TraceMonkey / JaegerMonkey</p>
<p>渲染引擎：Gecko</p>
</blockquote>
</li>
<li>
<p>Microsoft 公司</p>
<blockquote>
<p>浏览器：IE6-8 / IE9-11</p>
<p>JS 引擎：JScript / Chakra</p>
<p>渲染引擎：Trident</p>
</blockquote>
</li>
<li>
<p>Microsoft 公司</p>
<blockquote>
<p>浏览器：Edge</p>
<p>JS 引擎：Chakra</p>
<p>渲染引擎：Edge</p>
</blockquote>
</li>
<li>
<p>Apple 公司</p>
<blockquote>
<p>浏览器：Safari</p>
<p>JS 引擎：SquirrelFish Extreme</p>
<p>渲染引擎：Webkit</p>
</blockquote>
</li>
<li>
<p>Google 公司</p>
<blockquote>
<p>浏览器：Chrome</p>
<p>JS 引擎：V8</p>
<p>渲染引擎：Webkit / Blink</p>
</blockquote>
</li>
<li>
<p>Opera 公司</p>
<blockquote>
<p>浏览器：Opera</p>
<p>JS 引擎：Linear A/B / Futhark / Carakan</p>
<p>渲染引擎：Presto / Blink</p>
</blockquote>
</li>
</ol>
</div>
                    <div class="post_footer">
                        
                        
                        <div id="link">
                            <p>本博客所有文章除特别声明外，均采用 CC BY-SA 3.0协议 。转载请注明出处！</p>
                            <p><span id="link_href"></span><i class="ri-file-copy-2-line link_btn"></i></p>
                        </div>
                        
                        <div class="meta">
                            <div class="info">
                                <span class="field tags">
                                    <i class="ri-price-tag-2-line"></i>
                                    
                                    <a href="https://awesome404.gitee.io/tags/javascript/">JavaScript</a>
                                    
                                </span>
                            </div>
                        </div>
                        
                    </div>
                </div>
                
                
            </div>
        </div>
    </div>
    <a id="back_to_top" href="#" class="back_to_top"><i class="ri-arrow-up-s-line"></i></a>
    
<style>
  #hitokoto {
    overflow: hidden;
    margin: 0 auto;
    width: 80%;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 16px;
    color: #424242;
  }

  .footer {
    padding: 30px 0px;
  }
</style>

<footer class="footer">
  <p id="hitokoto">:D 获取中...</p>
</footer>

<script>
  fetch("https://v1.hitokoto.cn")
    .then((response) => response.json())
    .then((data) => {
      const hitokoto = document.getElementById("hitokoto");
      hitokoto.href = "https://hitokoto.cn/?uuid=" + data.uuid;
      hitokoto.innerText = data.hitokoto;
    })
    .catch((err) => err);
</script>

    <script src="https://awesome404.gitee.io/js/jquery-3.5.1.min.js"></script>
<link href="https://awesome404.gitee.io/css/fancybox.min.css" rel="stylesheet">
<script src="https://awesome404.gitee.io/js/fancybox.min.js"></script>
<script src="https://awesome404.gitee.io/js/zozo.js"></script>




</body>


<script>
    (function (){
        
        function handleIcon (remove, target){
            this.classList.remove(remove);
            this.classList.add(target);
        }

        let hrefEl = document.getElementById("link_href");
        let copyBtn = document.getElementsByClassName("link_btn")[0];
        if (hrefEl){
            hrefEl.innerText = `文章链接: ${location.href}`;
            
            copyBtn.onclick = (event) => {
                
                navigator.clipboard.writeText(`文章转载自: ${location.href}`)
                
                handleIcon.call(event.target, "ri-file-copy-2-line", "ri-check-line");
                let timer = setTimeout(() => {
                    handleIcon.call(event.target, "ri-check-line", "ri-file-copy-2-line");
                    clearTimeout(timer)
                }, 1000)
            }
        }
    })();
</script>
</html>